<template>
  <div>
    <div @click="fatherFn">
      <button @click.stop="btnFn">.stop 阻止事件冒泡</button>
      <a href="http://www.baidu.com" @click.prevent.stop="aFn"
        >去百度 .prevent阻止默认行为</a
      >
    </div>
  </div>
</template>

<script>
//vue事件的修饰符
//语法： @事件名.修饰符="methods里的方法名"
//.stop  阻止冒泡
//.prevent 阻止默认行为
export default {
  methods: {
    fatherFn() {
      console.log("fahter触发click事件父级点击事件被触发了");
    },
    oneFn() {
      console.log("子级点击事件被触发了");
    },
  },
};
</script>

<style>
</style>